<script setup>
import { ref } from 'vue';
import { useFormOperate } from '@/hooks/pages-repeat';
import { createApi, updataApi, getInfoApi } from '@/api/job/schedule.js';

const emits = defineEmits(['modalClose'])
const { 
  dataFormRef,
  modalOpen,
  confirmLoading,
  detailLoading,
  dataForm,
  requestObj,
  submit,
  init
} = useFormOperate()

requestObj.value = {
  createApi,
  updataApi,
  getInfoApi,
  submitCallback: emits
}

dataForm.value = {
  id: undefined,
  beanName: '',
  params: '',
  cronExpression: '',
  remark: '',
  status: 0
}

const rules = ref({
  beanName: [{ required: true, message: '请输入bean名称!' }],
  cronExpression: [{ required: true, message: '请输入cron表达式!' }],
})

defineExpose({
  init
})

</script>

<template>
  <a-modal 
    width="40%"
    v-model:open="modalOpen" 
    :confirm-loading="confirmLoading"
    :title="dataForm.id ? '修改定时任务' : '新增定时任务'" 
    okText="确定"
    cancelText="取消"
    :maskClosable="false"
    :bodyStyle="{'padding': '20px'}"
    @cancel="emits('modalClose')"
    @ok="submit"
    >
    <a-spin :spinning="detailLoading">
      <a-form ref="dataFormRef" layout="vertical" :model="dataForm" :rules="rules" name="dataForm" autocomplete="off">
        <a-form-item label="bean名称" name="beanName">
          <a-input v-model:value.trim="dataForm.beanName" placeholder="spring bean名称，如testTask" />
        </a-form-item>

        <a-form-item  label="参数">
          <a-input v-model:value.trim="dataForm.params" placeholder="请输入参数" />
        </a-form-item>

        <a-form-item  label="cron表达式" name="cronExpression">
          <a-input v-model:value.trim="dataForm.cronExpression" placeholder="如：0 0 12**？" />
        </a-form-item>

        <a-form-item  label="备注">
          <a-input v-model:value.trim="dataForm.remark" placeholder="请输入备注" />
        </a-form-item>
      </a-form>
    </a-spin>
  </a-modal>
</template>

<style lang="scss" scoped>

</style>